<template>
    <div id="mask">
    <div class="background" onclick="showMenu()"></div>
  </div>
  <div id="top">
    <div class="w640">
      <div class="title">
        <h3>会员中心</h3>
      </div>
      <div class="icon_link left">
        <RouterLink to="/">
          <i class="iconfont icon-arrows_left"></i>
        </RouterLink>
      </div>
      <div class="icon_link right">
        <a href="javascript:showMenu()">
          <i class="iconfont icon-menu_learn"></i>
        </a>
      </div>
      <div id="menu">
        <ul>
          <li><a href="./panel.htm"><i class="iconfont icon-live_me"></i>用户中心</a></li>
          <li><a href="./register.htm"><i class="iconfont icon-invite_friends"></i>注册账号</a></li>
          <li><a href="./address.htm"><i class="iconfont icon-location"></i>收货地址</a></li>
          <li><a href="./message.htm"><i class="iconfont icon-message_learn"></i>站内消息</a></li>
          <li><a href="order_list.htm"><i class="iconfont icon-means"></i>订单管理</a></li>
          <li><a href="./customer.htm"><i class="iconfont icon-customer"></i>客户服务</a></li>
        </ul>
      </div>
    </div>
  </div>
  <div id="app" class="member">
    <div id="member_top">
      <dl class="member_head">
        <dt>
          <img :src="UserStore.avatar" class="avatar">
        </dt>
        <dd>  
          <h3>{{ UserStore.username }} <span class="vip"><i class="iconfont icon-vip5"></i></span></h3>
          <p>137876544112@qq.com</p>
        </dd>
      </dl>
      <div class="my_order">
        <h3><b>我的订单</b><a href="./order_list.htm">查看全部订单<i class="iconfont icon-arrows_right"></i></a></h3>
        <ul>
          <li><a href="./order_list.htm"><span><i
                  class="iconfont icon-make_money_line"></i></span><small>待付款</small></a></li>
          <li><a href="./order_list.htm"><span><i class="iconfont icon-receipt"></i></span><small>待发货</small></a>
          </li>
          <li><a href="./order_list.htm"><span><i class="iconfont icon-earned_premium"></i></span><small>待收货</small></a>
          </li>
          <li><a href="./order_list.htm"><span><i class="iconfont icon-grab_class"></i></span><small>已完成</small></a>
          </li>
        </ul>
      </div>
    </div>
    <div id="member_nav">
      <ul>
        <li>
          <a href="./user_profile.htm">
            <i class="iconfont icon-id"></i>
            <span>我的资料</span>
          </a>
        </li>
        <li>
          <a href="javascript:lvlUp(4)">
            <i class="iconfont icon-service"></i>
            <span>会员升级</span>
          </a>
        </li>
        <li>
          <a href="./message_list.htm">
            <cite class="new">5</cite>
            <i class="iconfont icon-message_learn"></i>
            <span>消息通知</span>
          </a>
        </li>
        <li>
          <a href="./friend.htm">
            <i class="iconfont icon-my_meetings"></i>
            <span>我的好友</span>
          </a>
        </li>
        <li>
          <a href="">
            <i class="iconfont icon-jifen"></i>
            <span>积分管理</span>
          </a>
        </li>
        <li>
          <a href="">
            <i class="iconfont icon-study_line"></i>
            <span>专家咨询</span>
          </a>
        </li>
        <li>
          <a href="./certify.htm">
            <i class="iconfont icon-business_permit"></i>
            <span>授权证书</span>
          </a>
        </li>
        <li>
          <a href="">
            <i class="iconfont icon-customer"></i>
            <span>在线客服</span>
          </a>
        </li>
      </ul>
    </div>
  </div>
   <!-- 底部固定导航 -->
 <bottomNav></bottomNav>
</template>

<script lang="ts" setup name="User">
  import bottomNav from "@/components/bottomNav/index.vue"
  //获取用户小仓库
import useUserStore from '@/store/modules/users'
const UserStore =useUserStore()
</script>

<style scoped lang="scss">
.avatar{
  border-radius: 50%;
}
</style>